<template>
  <a-modal
    v-model:visible="visible"
    title="复制节点"
    title-align="start"
    @cancel="handleCancel"
    @before-ok="handleBeforeOk"
    modal-class="formModal"
    :mask-closable="false"
  >
    <a-form ref="formRef" :model="form" style="height: 180px">
      <a-form-item
        field="copyNodeParentId"
        label="节点"
        label-col-flex="100px"
        :rules="[{ required: true, message: '请选择需要复制的节点' }]"
      >
        <a-tree-select
          :data="treeData"
          v-model="form.copyNodeParentId"
          placeholder="请选择需要复制的节点"
          :fieldNames="{ key: 'id', title: 'nodeName', children: 'childList' }"
          style="width: 100%"
        ></a-tree-select>
      </a-form-item>
      <a-form-item
        field="nodeName"
        label="复制节点名称"
        label-col-flex="100px"
        :rules="[{ required: true, message: '请输入复制节点名称' }]"
      >
        <a-input v-model="form.nodeName" placeholder="请输入复制节点名称" />
      </a-form-item>
      <a-form-item
        field="nodeCode"
        label="复制节点编号"
        label-col-flex="100px"
        :rules="[{ required: true, message: '请输入复制节点编号' }]"
      >
        <a-input v-model="form.nodeCode" placeholder="请输入复制节点编号" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script setup>
import { ref, defineProps, defineEmits, defineExpose, reactive } from 'vue'
import { Message } from '@arco-design/web-vue'
import { apiHome } from '@/api/healthAssessment'
const emit = defineEmits(['funCardDataList'])
const props = defineProps({
  satelliteId: {
    type: String,
    default: ''
  },
  nodeId: {
    type: String,
    default: ''
  }
})
const visible = ref(false)
const treeData = ref([]) // 节点树
const form = reactive({
  copyNodeId: '', // 复制的节点id
  satelliteId: '', // 复制的节点卫星id
  copyNodeParentId: '', // 复制到的节点id
  nodeName: '', // 节点名称
  nodeCode: '' // 节点code
})
// 获取节点树
const funNodeTree = () => {
  apiHome
    .getPortraitNodeTree()
    .then((res) => {
      if (res.code === 200) {
        treeData.value = res.data
      }
    })
    .catch(() => {})
}
const formRef = ref()
// 显示弹框
const handleClick = () => {
  funNodeTree()
  form.copyNodeId = ''
  form.satelliteId = ''
  form.copyNodeParentId = ''
  form.nodeName = ''
  form.nodeCode = ''
  formRef.value.resetFields()
  visible.value = true
}
// 提交
const handleBeforeOk = (done) => {
  formRef.value.validate((errors) => {
    if (!errors) {
      form.copyNodeId = props.nodeId
      form.satelliteId = props.satelliteId
      apiHome
        .getNodeCopy({
          copyNodeId: form.copyNodeId,
          copyNodeParentId: form.copyNodeParentId,
          nodeCode: form.nodeCode,
          nodeName: form.nodeName,
          satelliteId: form.satelliteId
        })
        .then((res) => {
          if (res.code === 200) {
            Message.success('复制成功！')
            done()
            handleCancel()
            emit('funCardDataList')
          } else {
            Message.error(res.message)
          }
          done(false)
        })
        .catch(() => {
          done(false)
        })
    } else {
      done(false)
    }
  })
}
// 取消
const handleCancel = () => {
  visible.value = false
}
defineExpose({
  handleClick
})
</script>
<style lang="less" scoped>
.arco-btn-primary {
  background: #3075ac;
  color: #fff;
  border: 1px solid #3075ac;
  &:hover {
    background-color: #3075ac;
  }
}
</style>
